﻿@model IEnumerable<DAL.Post_ManagePosts_View>
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_LayoutAdmin.cshtml";
                    // WebGrid grid = new WebGrid(Model,rowsPerPage:5);
}
<!DOCTYPE html>
<html>
<head>
    <script src="../../Scripts/jquery-1.8.2.js" type="text/javascript"></script>
    <link href="../../Content/Datatable/jquery.dataTables.css" rel="stylesheet" type="text/css" />
    <script src="../../Content/Datatable/jquery.dataTables.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {

            var oTable = $('#myDataTable').dataTable({
                "oLanguage": {
                    "sSearch": "Search All:"
                },
                "bServerSide": true,
                "sAjaxSource": "DatatableListPosts?status=" + '@ViewBag.status',
                "sPaginationType": "full_numbers",
                "bProcessing": true,
                "aoColumns": [
                    { "sName": "AvatarPost",
                        "bSearchable": false,
                        "bSortable": false,
                        "fnRender": function (obj) {
                            var postID = obj.aData[0];
                            var rendered = obj.aData[1];
                            return '<a href="/ManagePosts/ManViewPost?postID=' + postID + '"><img src="../Content/images/PostImage/' + rendered + '" style="width:100px; height:100px"/></a>';
                        }
                    },
                    { "sName": "Title",
                        "fnRender": function (obj) {

                            var rendered = obj.aData[2];
                            return rendered;
                        }

                    },
                    { "sName": "Available",
                        "fnRender": function (obj) {
                            var rendered = obj.aData[3];
                            return rendered;
                        }

                    },
                    { "sName": "TypeOfHouse",
                        "fnRender": function (obj) {
                            var rendered = obj.aData[4];
                            return rendered;
                        }
                    },
                    { "sName": "Province",
                        "fnRender": function (obj) {
                            var rendered = obj.aData[5];
                            return rendered;
                        }
                    },
                    { "sName": "District",
                        "fnRender": function (obj) {
                            var rendered = obj.aData[6];
                            return rendered;
                        }
                    },
                    {
                        "sName": "Username",
                        "fnRender": function (obj) {
                            var rendered = obj.aData[7];
                            return rendered;
                        }
                    },
                    { "sName": "TimeCreate",
                        "fnRender": function (obj) {
                            var rendered = obj.aData[8];
                            return rendered;
                        }

                    }
                ]
            });
            });
        var url = window.location.href;
        if(url.indexOf("status=1") != -1) {
            $('#approve').css('color', '#5b0f32');
        }
        if (url.indexOf("status=0") != -1) {
            $('#under').css('color', '#5b0f32');
        }
        if (url.indexOf("status=-1") != -1) {
            $('#reject').css('color', '#5b0f32');
        }
        if (url.indexOf("status=2") != -1) {
            $('#allpost').css('color', '#5b0f32');
        }
    </script>
  
</head>
<body>
    <div id="container">
        <div id="demo" style="padding: 5px">
       <table id="myDataTable" class="display" >
                <thead>
                    <tr>
                        <th style="width: 100px;">
                            Avatar
                        </th>
                        <th style="width: 100px;">
                            Title
                        </th>
                        <th style="width: 50px;">
                            Available
                        </th>
                        <th style="width: 80px;">
                            TypeOfHouse
                        </th>
                        <th style="width: 100px;">
                            Province
                        </th>
                        <th style="width: 100px;">
                            District
                        </th>
                        <th style="width: 80px;">
                            UserCreate
                        </th>
                        <th style="width: 120px;">
                            TimeCreate
                        </th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
</body>
</html>
